// zustand
import { create } from "zustand";
// 1.创建store
const useStore = create((set) => {
  // create函数要求返回一个对象
  // set用于修改数据的方法，传入一个函数/对象
  return {
    // 定义状态数据
    count: 0,
    // 修改状态数据方法(依赖state)
    inc: () => {
      set((state) => ({
        count: state.count + 1,
      }));
    },
    // 修改状态数据的方法(不依赖state)
    addTo: (num) => {
      set({
        count: num,
      });
    },
  };
});

function App() {
  // 2.绑定store到组件获取store中的状态数据和修改状态的方法
  const { count, inc, addTo } = useStore();
  return (
    <>
      <div>count：{count}</div>
      <button onClick={inc}>点我count++</button>
      <button onClick={() => addTo(100)}>点我count=100</button>
    </>
  );
}

export default App;
